.admin-customer {
	position: fixed;
	top: 62px;
	left: 100px;
	right: 12px;
	bottom: 12px;
	border: 1px solid #e5e5e5;
	display: flex;
	flex-direction: row;
	background-color: #ffffff;
	z-index: 10;
	border-radius: 4px;

	.customer-left {
		width: 200px;
		border-right: 1px solid #e5e5e5;
		display: flex;
		flex-direction: column;

		.left-top {
			height: 40px;
			line-height: 40px;
			font-size: 15px;
			padding-left: 10px;
			border-bottom: 1px solid #e5e5e5;
		}

		.left-lcen {
			flex: 1;
			min-height: 0;
			overflow: auto;

			.lcen-li {

				.lcen-li_box {
					padding: 10px;
					display: flex;
					flex-direction: row;
					align-items: center;
					cursor: pointer;
				}

				.lcen-li-frame {
					position: relative;

					.lcen-li-img {
						width: 30px;
						height: 30px;
						border-radius: 2px;
					}

					.lcen-li-mat {
						width: 6px;
						height: 6px;
						border-radius: 6px;
						background-color: red;
						position: absolute;
						right: 0px;
						top: 0px;
					}
				}

				.lcen-li-text {
					font-size: 12px;
					flex: 1;
					min-width: 0;
					margin-left: 10px;

					.lcen-li-text_p {
						width: 100%;
						overflow: hidden;
						text-overflow: ellipsis;
						white-space: nowrap;
					}

					.lcen-li-text_p2 {
						font-size: 12px;
						color: #999999;
						margin-top: 5px;
					}
				}
			}

			.lcen-active {
				background-color: #3771e4;

				.lcen-active-text {
					color: #ffffff;
				}
			}
		}

		.left-lbottom {
			background-color: #f3f4f8;
			border-top: 1px solid #e5e5e5;
			padding: 10px;

			i {
				font-size: 18px;
				color: #3089dc;
				cursor: pointer;
			}
		}
	}

	.customer-center {
		min-width: 0;
		flex: 1;
		display: flex;
		flex-direction: column;

		.center-head {
			height: 40px;
			padding: 10px;
			display: flex;
			align-items: center;

			.center-head-img {
				width: 25px;
				height: 25px;
				border-radius: 2px;
			}

			.center-head-text {
				font-size: 12px;
				margin-left: 10px;
			}
		}

		.center-texeart {
			min-height: 0;
			flex: 1;
			overflow: auto;
			border-bottom: 1px solid #e5e5e5;
			border-top: 1px solid #e5e5e5;
			padding: 20px 10px;

			.center-texeart-li {
				margin-bottom: 15px;

				.texeart-li-name {
					display: flex;
					align-items: center;

					.li-name-t1 {
						font-size: 12px;
						color: #57a757;
						font-weight: bold;
					}

					.li-name-t2 {
						font-size: 12px;
						color: #999999;
						margin-left: 10px;
					}

					.li-name-t3 {
						color: #4a98e0;
					}
				}

				.texeart-li-t {
					padding: 10px;
					font-size: 13px;
					line-height: 20px;
				}
			}
		}

		.center-inptbox {
			height: 200px;
			display: flex;
			flex-direction: column;

			.inptbox-iconbox {
				display: flex;
				align-items: center;
				padding: 5px 0;

				.inptbox-iconbox-left {
					display: flex;
					align-items: center;

					.inptbox-iconbox-icon {
						font-size: 20px;
						color: #708ea9;
						margin: 0 10px;
						cursor: pointer;
					}

					.inptbox-iconbox-img {
						width: 22px;
						height: 22px;
						margin-left: 16px;
					}
				}

				.inptbox-iconbox-flexz {
					flex: 1;
				}
			}

			.inptbox-send {
				min-height: 0;
				flex: 1;

				.inptbox-send-ipt {
					width: 100%;
					height: 100%;
					overflow: auto;
					padding: 10px;
					resize: none;
					outline: none;
				}

				.inptbox-send-divcont {
					width: 100%;
					height: 100%;
					overflow: auto;
					padding: 10px;
					resize: none;
					outline: none;
					word-wrap: break-word;
					word-break: normal;
				}
			}

			.inptbox-buts {
				display: flex;
				align-items: center;
				justify-content: flex-end;
				padding: 5px 10px;

				.inptbox-bt {
					cursor: pointer;
					border: 1px solid #e6e7eb;
					border-radius: 2px;
					padding: 5px 12px;
					color: #999999;
					font-size: 12px;
					margin-left: 10px;
				}
			}
		}
	}

	.customer-right {
		width: 300px;
		border-left: 1px solid #e5e5e5;
		display: flex;
		flex-direction: column;

		.right-ul {
			flex: 1;
			min-height: 0;
			overflow: auto;

			.right-li {
				.right-li-txt {
					background-color: #ebf0f5;
					padding: 10px;
					cursor: pointer;

					i {
						font-size: 14px;
						margin-right: 5px;
						transition: transform 0.5s;
					}

					.right-li-icon {
						transform: rotate(90deg);
					}
				}

				.right-li-cul {
					max-height: 0;
					transition: max-height 0.5s;
					overflow: auto;

					.right-li-cli {
						padding: 5px 0 5px 40px;
						cursor: pointer;
						line-height: 18px;
					}

					.right-li-cli:hover {
						background-color: #e6e7eb;
					}
				}

				.right-li-active {
					max-height: 400px;
				}
			}
		}

		.right-footer {
			border-top: 1px solid #e5e5e5;
			padding: 10px 0;

			a {
				font-size: 14px;
				color: #708ea9;
				cursor: pointer;
				margin-left: 15px;
			}
		}
	}
}